<template>
	<div class="mainPage">
		<span>hello</span>
	</div>
</template>

<script>

export default {
	name: "mainPage"
};
</script>

<style lang="scss">
	.mainPage{
		font-size: 88px;font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; text-align: center; margin-top: calc(50vh - 88px); font-weight: 100; animation: enter 1s; position: relative; border-bottom: solid 1px rgba(95, 95, 95, 0.1); -webkit-box-reflect: below 0px -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(.4, transparent), to(rgba(3,3,3,.4))); span{ background-image: -webkit-linear-gradient(45deg,#9ba5cf, #0d2055); -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: fontcolor 2s infinite linear; } @keyframes fontcolor { from {-webkit-filter: hue-rotate(0deg);} to {-webkit-filter: hue-rotate(-360deg);} } @keyframes enter { from {opacity: 0; top: 36px;} to {opacity: 1; top: 0;} }
	}
</style>
